<template>
	<div class="theme">
		<van-nav-bar title="我的身份" left-arrow @click-left="onClickLeft" />
		<div class="overlay headTop">
			<div class="overlay-content scrolling">
				<div style="padding: 10px 20px;background: white;border-bottom: 1px solid rgb(235, 237, 240);height: 30px;">
					<van-row type="flex" justify="space-between">
						<van-col span="8" style="position: relative;top: 5px;">头像</van-col>
						<van-col span="16" style="width: 30px;height: 30px;">
							<van-image round width="30" height="30" src="https://img.yzcdn.cn/vant/cat.jpeg" />
						</van-col>
					</van-row>
				</div>
				<div style="padding: 10px 20px;background: white;border-bottom: 1px solid rgb(235, 237, 240);height: 30px;">
					<van-row type="flex" justify="space-between">
						<van-col span="8" style="position: relative;top: 5px;">身份名</van-col>
						<van-col span="16" style="text-align: right;">
							<span style="color: #22A0FF;position: relative;top: 7px;">DKAIEI</span>
						</van-col>
					</van-row>
				</div>
				<div style="padding: 10px 20px;background: white;border-bottom: 1px solid rgb(235, 237, 240);height: 30px;">
					<van-row type="flex" justify="space-between">
						<van-col span="8" style="position: relative;top: 5px;">身份 ID</van-col>
						<van-col span="16" style="text-align: right;">
							<span style="color: rgb(125, 126, 128);position: relative;top: 7px;">DKAIEI0000999</span>
						</van-col>
					</van-row>
				</div>
				<div style="background: white;width: 100%;height: 50px;text-align: center;margin-top: 30px;font-size: 15px;color: #22A0FF;border-bottom: 1px solid rgb(235, 237, 240);" @click="noQuit">
					<span style="position: relative;top: 15px;">备份身份</span>
				</div>
				<div style="background: white;width: 100%;height: 50px;text-align: center;font-size: 15px;color: rgb(255, 0, 0);" @click="quit">
					<span style="position: relative;top: 15px;">退出当前身份</span>
				</div>
			</div>
		</div>
		<van-dialog v-model="show" :show-confirm-button="false">
			<div align="center">
				<div style="padding: 20px 0px;">
					<img src="../../assets/images/phone.png" style="width: 60px;">
				</div>
				<span style="font-weight: 600;font-size: 15px;">退出身份</span>
				<span style="display: block;padding-top: 10px;font-size: 14px;padding-left: 30px;padding-right: 30px;">退出身份后将删除所有钱包数据，请务必确保所有钱包已备份</span>
			</div>
			<div align="center">
				<van-row style="padding: 30px">
					<van-col span="12" @click="qx">
						<van-button round type="primary" style="width: 90%;border-radius: 5px;height: 38px;line-height: 36px;" color="#FFE4E1">
							<span style="color: #FF4500;">取消</span>
						</van-button>
					</van-col>
					<van-col span="12" @click="sure">
						<van-button round type="primary" style="width: 90%;border-radius: 5px;height: 38px;line-height: 36px;" color="#FF4500">确认退出</van-button>
					</van-col>
				</van-row>
			</div>
		</van-dialog>
		<van-dialog v-model="show2" title="清输入密码" :show-confirm-button="false" style="background: rgb(245, 245, 245);border-radius: 5px;">
			<div align="center" style="font-size: 12px;color: rgb(125, 126, 128);padding: 10px 30px;">
				<span>警告：若无妥善备份，删除钱包后将无法找回钱包，请慎重处理该操作</span>
				<van-field v-model.trim="value" maxlength="50" style="padding: 5px 15px;margin: 15px 0px;width: auto;"/>
			</div>
			<div style="background: white;color: #108CE9;" align="center">
				<van-row style="padding: 10px 0px;">
				  <van-col span="12" style="border-right: 1px solid rgb(245, 245, 245);" @click="qx2">取消</van-col>
				  <van-col span="12" @click="sure2">确认</van-col>
				</van-row>
			</div>
		</van-dialog>
	</div>
</template>

<script>
	let _this;
	export default {
		name: 'MyIdentity',
		components: {},
		props: {},
		data() {
			return {
				show: false,
				show2: false,
				value: ''
			};
		},
		beforeCreate() {
			_this = this;
		},
		watch: {},
		computed: {},
		methods: {
			onClickLeft() {
				this.$router.push({
					path: '/Mine'
				});
			},
			quit() { // 退出当前身份
				this.show = true;
			},
			qx() { // 取消按钮
				this.show = false;
			},
			sure() { // 确认退出
				this.show = false;
				this.$router.push({
					path: '/Login'
				});
			},
			qx2() { // 取消按钮
				this.show2= false;
			},
			sure2() { // 确认退出
				if(!this.value) {
					this.$toast("密码不能为空");
					return false;
				}
				this.show2 = false;
				this.$router.push({
					path: '/Login'
				});
			},
			noQuit() {
				this.show2 = true;
			}
		},
		created() {},
		mounted() {},
		destroyed() {

		},
		filters: {}
	};
</script>

<style lang="less" scoped>
	.overlay {
		background: rgb(245, 245, 245);
	}
</style>